Wildform is the creator of the SWfX SWF text effects generator and the Flix SWF video encoder. This tutorial was to accompany and explain the attached .FLA, authored in Flash 4. last modified October 30, 2000 ©2000 Wildform, Inc.

<- back to tutorials

Wildform Banner Ad Engine

Table of Contents

Concepts Covered Introduction The Mechanism The .FLA

Concepts Covered

Load Movie() Pre-caching external SWFs GetTimer Random() Duplicate Movie Clip() GetProperty() Expressions

Table of Contents

Introduction

When we constructed the first website for Wildform SWfX, we built the entire site in Flash. In general this led to a more attractive and exciting user experience, as well as one that is easier to manage. What's more, we realized we could build an engine for banner ads designed to rotate multiple ads into the same space without the user having to load a new page, or reload the current one. However, once the site went online we uncovered some unusual errors, which we could not explain through the documentation. One such error occurred when the Flash movie would request an external .SWF through the Load Movie command. In this instance, the server would receive the request (a fact which we determined by investigating the server logs), but the external SWF would never load. This would prove to be a problem especially if the site had been up and running for some time in a single browser window. This problem increased in severity as our traffic grew. Eventually we modified the banner engine to ensure that an ad would always be on display, by building a mechanism that could determine if an external SWF had successfully loaded. This wasn't easy. Since we did not create the ads, we could not insert any custom actionscript (such as Set Variable "ad_loaded" = "true"). If we wanted this code to work for all external SWFs (even those we did not create) all the work had to be done from within the engine itself. The technique used to accomplish this also enabled us to create a custom transition between any two ads - one fades in and one fades out simultaneously (a dissolve), which could only be accomplished by guaranteeing that the next ad loads before the current one fades out.

Table of Contents

The Mechanism

download this .fla Briefly, this engine operates in the following manner: Select an ad to load. Duplicate the empty movie clip, into which you will place your external ad. Issue Load Movie command to load external ad. After "hook" milliseconds, check to see if that ad has loaded. If the ad hasn't loaded, go to 3. If the ad is loaded, tell the movie clip, which contains the empty movie clip, to fade in. After "load" milliseconds, select the next ad to load. Duplicate the empty movie clip, into which you will place your external ad. Issue Load Movie command to load external ad. After "hook" milliseconds, check to see if that ad has loaded. If the ad hasn't loaded, go to 8. If the ad has loaded BUT the current ad has not been on display "swap" milliseconds, wait until "swap" milliseconds have passed. Once the new ad has loaded AND the current ad has been on display "swap" milliseconds, fade out current ad and fade in new ad simultaneously. GoTo 6 In order to employ this code verbatim, all your ads need to be in a subdirectory called "ads" and must be named, "1.swf", "2.swf", "3.swf", etc. This engine was constructed in this manner to reduce file size - with this mechanism, one need not store the file names in the banner engine (that text would add significantly to the current-2K file size), or load additional external text files with variables. No matter how many ads you need to load, this engine will not increase in size. To customize the functions of this engine, such as how many ads are in the library and how long each should be on display, you will need to adjust any of four variables, all of which are initialized in the first frame of the main timeline: Swap = the minimum number of milliseconds an ad should be on display before fading out. Load = the number of milliseconds after an ad has been on display, that the next ad is selected and pre-loaded. Hook = the number of milliseconds after the Load Movie command is issued, that the Flash player checks to see if the external SWF has loaded. Ads = the number of ads in rotation.

Table of Contents

The .FLA

The main timeline is quite simple. Four keyframes and two movie clips. One movie clip, in the layer "main" is the control mechanism for the engine. The other movie clip, in the layer "shell", contains the empty movie clip with keyframe animation (fading in and out) and a mask, which hides the ad once it is loaded until it is ready to be displayed. The first frame of the main timeline contains the four variables, described above, which determine how the engine operates. On frame two, the Flash player instructs the "main" movie clip to go to "1off" to load the first ad. Then the main timeline stops. The main movie clip, which controls most of the functions of this engine, is actually quite simple. First, the player must select an ad to load. The Flash player sets the variable "rad" (short for random ad - in this project we employ short variable names to minimize file size) as a random number from the set of 0 to ads-1 (Set Variable "rad" = "Random(../:ads)). Then, since we want a scale of 1 to ads (instead of 0 to ads-1), Set Variable "rad" = rad + 1. So, let's say for example that the Flash player choose rad = 1. Then, rad = rad + 1 = 2. (This engine runs on a random basis, but could just as easily follow a fixed set of rules - simply change the equation.) At this point, the engine initializes a variable, "nad" (short for ad number) to track how many ads have been displayed. This is necessary to give an appropriate name and depth to the shell movie clip, which is duplicated each time a new ad is loaded. So, since nad = 1, the expression, ("../shell", "shell"&../:nad,../:nad), in this command: Duplicate Movie Clip ("../shell", "shell"&../:nad,../:nad) translates directly to Duplicate Movie Clip ("../shell", "shell1", 1) which creates a new movie clip called "shell1", with a depth of 1, by duplicating the movie clip "shell". On the second frame, labeled "1do", the Flash player now loads the selected external SWF into "shell1", with the following command: Load Movie ("ads/"&rad&".swf", "../shell"&../:nad&"/ad") which translates directly to Load Movie ("ads/2.swf", "../shell1/ad") This instructs the Flash player to load 2.swf into the empty movie clip "ad" within the newly created movie clip of "shell1". At this point, I create a new variable, "hookt" (short for hook timer), and set it to GetTimer. On the third frame of this sequence, labeled "1doLoop", the Flash player checks if more than "swap" milliseconds have passed since hookt was initialized. If this is true, the Flash player instructs the control movie to return to the previous frame to run the Load Movie command again and reset hookt. Otherwise, the Flash player checks to see if the width of the empty movie into which the ad is loading is greater than 0. If it is, this means the ad has loaded. If it isn't, the ad has not yet loaded. If the ad has not loaded, the movie proceeds to the next frame, which returns to 1doLoop. If, however, the ad has loaded, the Flash player instructs shell1 to go to "in" and play, which fades in the ad. Then two new variables, "swapper" and "loader" are initialized to track how long this ad is on display and when to pre-load the next ad. To ensure that the same ad is not loaded twice, I define a variable "radl" (short for last random ad) as rad-1, which is the same number that the initial random function returned. Since the next ad will be the second, I iterate nad. Finally, the control movie instructs the main timeline to proceed to "doLoop" (frame 3) and play. On this frame, the Flash player checks to see if it is time to load (not to display) the next ad (if GetTimer - load > loader). If it isn't, the main timeline proceeds to frame 4, which contains the simple instructions, GoTo doLoop. If it is time to load the new ad, the Flash player instructs the main control movie clip to proceed to "2off" and play. You will notice that the sequence of four frames beginning with "2off" is almost identical to the first sequence of four frames beginning with "1off". Since this is the case, I will only attempt to identify the differences. In "2off", rad is set to a random number, again. However, immediately afterwards, there is a While loop which compares the newly generated random number against the number of the current ad, to ensure that the same ad is not loaded twice in a row. Then, on the third frame of this sequence, labeled "doLoop", there are a few differences from the actionscript on the "1doLoop" frame. When this engine loaded the first ad, it did not need to ensure that the previous ad had been on display enough time, since there was no ad. Thus, now we must include (GetTimer - ../:swap) > ../:swaper in the If statement. Once both conditions in that If statement are true (the new ad is loaded and at least "swap" milliseconds have expired since the previous ad faded in), the Flash player instructs the new ad to fade in (above the current ad, since the new ad is at a higher depth) and then instructs the old ad to fade out.

Table of Contents

<- back to tutorials

©2000 Wildform, Inc.